var JcropOption = {
    actual:false,
    activate:true,
    ratio:100/67,
    croper:'fineArt.croper.php'
}

var imagesInOrder = false, texto1, texto2, texto3;

$(document).ready(function () {
    $('#sortableImages').disableSelection().sortable();
    $('#formFineArt').submit(function () {
        if (!imagesInOrder) {
            ordenarImagenes();
            $('#loaderModal').modal('show')
            return false
        } else {
            //texto1.post(); texto2.post(); texto3.post();
            return true;
        }
    });
    fileuploaderInit();
    onfileuploaddone();
    dropzone();
    showAlert();
    //editor();
})

function onfileuploaddone () {
    $('.recortarImagen, .borrarImagen').unbind('click')
    $('.recortarImagen').click(recortarImagen)
    $('.borrarImagen').click(borrarImagen)
    $('.borrarError').click(borrarError)
}

function fileuploaderInit () {
    $('#formFineArt').fileupload({
        url: BASE_URL+'admin/php/uploaders/fineArt.uploader.php',
        autoUpload:true
    })
    .bind('fileuploaddone', function (e, data) {
        $('#hiddenData').append('<input type="hidden" name="newImages[]" id="'+data.result.files[0].nombre+'" value="5" />')
        setTimeout(
            function () {
                $('.preview > img.recortable').imagesFrame(100, 67, true)
                onfileuploaddone();
            }, 
            300
        )
    })
    .bind('fileuploadfail', function (e, data){
        setTimeout(
            function () {
                $('.preview > img.recortable').imagesFrame(100, 67, true)
                onfileuploaddone();
            }, 
            300
        )
    })
}

function ordenarImagenes () {
    var data = '', id;
    $('#sortableImages li').each(function (i) {
        if (id = $(this).data('id')) {
            data += '&orden[]='+i;
            data += '&id[]='+id;
        } else {
            $('#hiddenData #'+$(this).data('nombre')).val($(this).data('nombre')+','+i+','+$(this).data('extension'))
        }
    })
    $.ajax({
        type:'POST',
        url:BASE_URL+'admin/php/controllers/ordenar.controller.php',
        data: 'tabla=imagen'+data,
        success:function () {
            imagesInOrder = true;
            //texto1.post(); texto2.post(); texto3.post();
            $('#formFineArt').submit();
        }
    })    
}

function recortarImagen () {
    crearJcrop($(this).parents('li').attr('id'))
    $('#coordenadas .nombre').val($(this).parents('li').find('.name').text())
}

function borrarImagen () {
    var data = {
        src:$(this).data('src'),
        carpeta:$(this).data('carpeta'),
        id:($(this).data('id'))?$(this).data('id'):0
    }
    $('#'+$(this).data('src').replace(/\.(jpg|png|gif)$/, '')).remove();
    $.ajax({
        type:'POST',
        url:BASE_URL+'admin/php/controllers/borrarImagenes.controller.php',
        data: data
    })
    $(this).parents('li').remove();
}

function borrarError () {
    $(this).parents('li').remove();
}

function showAlert() {
    if (document.location.hash == '#success') {
        $('.alert').show();
    }
}

function editor () {
    texto1 = new TINY.editor.edit('texto1', {
        id: 'texto1',
        width: '100%',
        height: 175,
        cssclass: 'tinyeditor',
        controlclass: 'tinyeditor-control',
        rowclass: 'tinyeditor-header',
        dividerclass: 'tinyeditor-divider',
        controls: ['bold', 'italic', 'underline', 'strikethrough', '|', 'subscript', 'superscript', '|',
        'link', 'unlink', 'undo', 'redo'],
        xhtml: true,
        bodyid: 'texto1',
        css:'body{background-color:#fff}'
    });
    texto2 = new TINY.editor.edit('texto2', {
        id: 'texto2',
        width: '100%',
        height: 175,
        cssclass: 'tinyeditor',
        controlclass: 'tinyeditor-control',
        rowclass: 'tinyeditor-header',
        dividerclass: 'tinyeditor-divider',
        controls: ['bold', 'italic', 'underline', 'strikethrough', '|', 'subscript', 'superscript', '|',
        'link', 'unlink', 'undo', 'redo'],
        css:'body{background-color:#fff}',
        xhtml: true,
        bodyid: 'texto2'
    });
    texto3 = new TINY.editor.edit('texto3', {
        id: 'texto3',
        width: '100%',
        height: 175,
        cssclass: 'tinyeditor',
        controlclass: 'tinyeditor-control',
        rowclass: 'tinyeditor-header',
        dividerclass: 'tinyeditor-divider',
        controls: ['bold', 'italic', 'underline', 'strikethrough', '|', 'subscript', 'superscript', '|',
        'link', 'unlink', 'undo', 'redo'],
        css:'body{background-color:#fff}',
        xhtml: true,
        bodyid: 'texto3'
    });
}